<script setup lang="ts">
import { existCloud } from "virtual:vue-music-play";
let hot = import.meta.hot;
let pre = function () {
  hot?.send("music", { msg: "pre" });
  console.log("pre");
};
let play = function () {
  hot?.send("music", { msg: "play" });
  console.log("play", existCloud);
};
let pause = function () {
  hot?.send("music", { msg: "pause" });
};
let next = function () {
  hot?.send("music", { msg: "next" });
};
console.log(existCloud);
</script>

<template>
  <div v-if="existCloud">
    <button @click="pre">上一首</button>
    <button @click="play">播放</button>
    <button @click="pause">暂停</button>
    <button @click="next">下一首</button>
  </div>
  <div>index</div>
</template>

<style scoped>
.logo {
  height: 6em;
  padding: 1.5em;
  will-change: filter;
  transition: filter 300ms;
}
.logo:hover {
  filter: drop-shadow(0 0 2em #646cffaa);
}
.logo.vue:hover {
  filter: drop-shadow(0 0 2em #42b883aa);
}
</style>
